<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<f:view xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:richx="http://richfaces.org/richx"
      contentType="text/html" encoding="UTF-8">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Popup In Same View State (Step 1)</title>
</head>
<body>
<h1>Step 1</h1>
<hr/>
	<h:form>
		<h:messages />
		<h:panelGroup id="panel">
			<p>Confirmations: ${counter.confirmations}, Cancellations: ${counter.cancellations}</p>
		    <a4j:commandButton value="Next &gt;&gt;" action="confirm" reRender="confirmation" oncomplete="#{rich:component('confirmation')}.show()" />  
		</h:panelGroup>
		<rich:modalPanel id="confirmation">
			<f:facet name="header">
	           	<h:outputText value="Confirmation" />
	       	</f:facet>
			<p><h:outputText value="Please, confirm you would like to continue" /></p>
			<p>Confirmations: ${counter.confirmations}, Cancellations: ${counter.cancellations}</p>
			<a4j:commandButton type="button" value="Yes" action="continue" />
			<a4j:commandButton type="button" value="No" action="cancel" reRender="panel" oncomplete="#{rich:component('confirmation')}.hide()" />
		</rich:modalPanel>
	</h:form>
</body>
</html>
</f:view>